import React, { useEffect } from 'react';
import { connect } from 'dva';
import PropTypes from 'prop-types';
import { Table, Popconfirm, Button, Space } from 'antd';

const MessageList = ({ dispatch, userid, messageList }) => {

  useEffect(() => {
    dispatch({
      type: 'message/getMessageByReply',
      payload: { messageUserid: userid },
    });
  })

  function handleCreate() {
    dispatch({
      type: 'message/setCreated',
      payload: {
        messageListState: 'sendmessage'
      }
    })
  }

  function handleDelete() {

  }

  const columns = [{
    title: '日期',
    dataIndex: 'messageTs'
  },{
    title: '标题',
    dataIndex: 'title',
  }];
  return (
    <div>
      <Space style={{ marginBottom: 16 }}>
        <Button onClick={handleCreate}>新建</Button>
        <Button onClick={handleDelete}>删除</Button>
      </Space>
        <Table
          dataSource={messageList}
          columns={columns}
          onRow={item => {
            return {
              onClick: () => {
                const { messageId } = item;
                dispatch({
                  type: 'message/setMessageState',
                  payload: {
                    messageId,
                    messageListState: 'checkmessage'
                  },
                });
              }
            }
          }}
        />
    </div>

  );
};

export default connect(state => {
  const { userid, username } = state.users;
  const { messageList } = state.message;
  return {
    userid,
    username,
    messageList
  }
})(MessageList);

